
<template>
 <div>
    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="vid"
        label="编号"
        width="180">
      </el-table-column>
      <el-table-column
        prop="vname"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="vmile"
        label="里程">
      </el-table-column>
    </el-table>
   <div class="block">
    <span class="demonstration">完整功能</span>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[2,4, 3, 8]"
      :page-size="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total">
    </el-pagination>
  </div>

 </div>
</template>

<script>
import {findVehicleAndTtypeByName143} from '../../api/page.js'
export default {
 methods: {
      handleSizeChange(val) {
        this.pageSize=val;
        this.getPage();
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        this.currentPage=val;
        this.getPage();
        console.log(`当前页: ${val}`);
      },
    async  getPage(){
      let result=await findVehicleAndTtypeByName143(this.currentPage,this.pageSize,'');
    console.log(result);
    this.tableData=result.data.pageinfo.records;
    this.total=result.data.pageinfo.total;
   }
    },
    data() {
      return {
       tableData:[],
       total:10,
       currentPage:1,
       pageSize:3
      };
    },created(){
      this.getPage();
    }
}
</script>

<style>

</style>